<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>mmkit: Samples &raquo; Forms</title>
	<meta name="description" content="mmkit css library forms sample page" />
	<meta name="keywords" content="mmkit forms" />
	<meta name="robots" content="all" />
	<meta http-equiv="imagetoolbar" content="no" />

	<!-- Framework CSS -->
	<link rel="stylesheet" href="../mmkit/base/screen.css" type="text/css" media="all" />
	<link rel="stylesheet" href="../mmkit/base/print.css" type="text/css" media="print" />
	<!--[if IE]><link rel="stylesheet" href="../mmkit/base/ie.css" type="text/css" media="all" /><![endif]-->
	<link rel="stylesheet" href="../mmkit/forms/screen.css" type="text/css" media="all" />

	<style type="text/css">
		body {
			text-align: left;
			padding: 0px 10px;
		}

	</style>
</head>
<body>
	<p id="skip-links"><a href="#content" title="Skip To Content">Skip To Content</a></p>
	<div id="wrapper" class="container">

		<form id="form-2" action="#" method="get" accept-charset="utf-8">
			<fieldset id="" class="layout">

				<div class="field field-50 field-first">
					<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
					<input id="fieldname" type="text" class="text" value="Text" />
					<p class="hint">This field has a hint</p>
				</div>
			</fieldset>
		</form>

<form id="form-2" action="#" method="get" accept-charset="utf-8">
	<fieldset id="" class="layout">
		<legend>Legend</legend>
		
		<div class="field field-50 field-first">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<input id="fieldname" type="text" class="text" value="Text" />
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field field-25">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<input id="fieldname" type="text" class="text" value="Text" />
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field field-25">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<select id="fieldname">
				<option>Select Box</option>
			</select>
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field error field-75 field-first">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<input id="fieldname" type="text" class="text" value="Text" />
		</div>
		
		<div class="field error field-25">
			<label>Radio Buttons</label>
			<p class="hint">This field has a hint</p>
			<div class="options">
				<label><input type="radio" class="radio" name="radio[]" value="4" /> Radio Option 4</label>
				<label><input type="radio" class="radio" name="radio[]" value="5" /> Radio Option 5</label>
				<label><input type="radio" class="radio" name="radio[]" value="6" /> Radio Option 6</label>
			</div>
		</div>
		
		<div class="field field-25 field-first">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<textarea id="fieldname3" cols="30" rows="5">Textarea text</textarea>
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field field-25">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<textarea id="fieldname3" cols="30" rows="5">Textarea text</textarea>
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field field-25">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<textarea id="fieldname3" cols="30" rows="5">Textarea text</textarea>
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field field-25">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<textarea id="fieldname3" cols="30" rows="5">Textarea text</textarea>
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field error field-100">
			<label for="fieldname3">Label <abbr class="required" title="Required">*</abbr></label>
			<textarea id="fieldname3" cols="30" rows="5">Textarea text</textarea>
		</div>

		<div class="buttons">
			<input id="fieldname" type="submit" class="submit" value="submit" />
		</div>

	</fieldset>

</form>

<form id="form-1" action="#" method="get" accept-charset="utf-8">
	<fieldset id="" class="">
		<legend>Legend</legend>
		
		<div class="field">
			<label for="fieldname">Label <abbr>*</abbr></label>
			<input id="fieldname" type="text" class="text" value="Text" />
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<input id="fieldname" type="text" class="text" value="Text" />
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<select id="fieldname">
				<option>Select Box</option>
			</select>
			<p class="hint">This field has a hint</p>
		</div>

		<div class="field error">
			<label for="fieldname">Label <abbr class="required" title="Required">*</abbr></label>
			<input id="fieldname" type="text" class="text" value="Text" />
		</div>
		
		<div class="field">
			<label>Radio Buttons</label>
			<p class="hint">This field has a hint</p>
			<div class="options">
				<label><input type="radio" class="radio" name="radio[]" value="1" /> Radio Option 1</label>
				<label><input type="radio" class="radio" name="radio[]" value="2" /> Radio Option 2</label>
				<label><input type="radio" class="radio" name="radio[]" value="3" /> Radio Option 3<br />Multi-line</label>
			</div>
		</div>

		<div class="field">
			<label for="fieldname3">Label <abbr class="required" title="Required">*</abbr></label>
			<textarea id="fieldname3" cols="30" rows="5">Textarea text</textarea>
		</div>

		<div class="buttons">
			<input id="fieldname" type="submit" class="submit" value="submit" />
		</div>

	</fieldset>

</form>

	</div>
</body>
</html>